<ion-view view-title="发布任务">
	<!--=== header ===-->
	<!-- <ion-header-bar class="bar-dark bar-positive">
		<div class="buttons buttons-left">
			<a class="button button-clear button-icon" ui-sref="app.tasks">
				<i class="ion-ios-arrow-left"></i></a>
		</div>

		<H1 class="title">发布任务需求</H1>
	</ion-header-bar> -->
	<!--=== / header ===-->

	<!--=== content ===-->
	<ion-content class="page">
		<form name="theForm" novalidate="novalidate">
			<div class="mb10">
				<div class="item">
					<label class="item-stacked-label item-icon-right item-input ">
						<span class="input-label ext-right color-7">任务类类型：</span>
						<button class="button button-dark button-outline button-small" modal-select ng-model="form.categoryObj"
						        on-select="cateChange()" options="categoryList" modal-title="请选择一个任务类类型">
							{{ form.categoryObj.name || &apos;请选择一个任务类型...&apos;}}
							<div class="option">
								<h2>{{option.name}}</h2>
								<p>{{option.settle.title}}</p>
							</div>
						</button>
						<i class="icon f12"
						   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm.categoryObj.$invalid]">
						 </i>
						<input type="hidden" name="categoryObj" ng-model="form.categoryObj" required>
					</label>
				</div>
				
				<div class="item">
					<label class="item-input item-stacked-label item-icon-right">
						<span class="input-label color-7">小区名称:</span>
						<input type="text" placeholder="填写小区名称" name="property" ng-model="form.property" required>
						<i class="icon f12"
						   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm.property.$invalid]"></i>
					</label>
				</div>

				<div class="item ">
					<label class="item-input item-stacked-label item-icon-right">
						<span class="input-label color-7">地址:</span>
						<input type="text" placeholder="填写工程地址" name="address" ng-model="form.address" required>
						<i class="icon f12"
						   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm.address.$invalid]"></i>
					</label>
				</div>
				<div class="item ">
					<label class="item-input item-stacked-label item-icon-right">
						<span class="input-label color-7">联系人:</span>
						<input type="text" placeholder="填写联系人" name="realname" ng-model="form.realname" required>
						<i class="icon f12"
						   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm.realname.$invalid]"></i>
					</label>
				</div>
				<div class="item ">
					<label class="item-input item-stacked-label item-icon-right">
						<span class="input-label color-7">手机:</span>
						<input type="tel" name="mobile" ng-model="form.mobile" placeholder="请填写手机号码" required>
						<i class="icon f12"
						   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm.mobile.$invalid]"></i>
					</label>
				</div>
			</div>
				<!--=== 上传图片 ===-->
			<div class="list">
				<div class="item item-divider">
					<h2 class="p15 D-center">上传任务图片</h2>
				</div>
				<label class="item">
					<div class="D-center mb10" ng-show="pictureSurplus>0">
						<button class="button button-aux button-outline"
						        ng-click="addPicture()">
							<i class="icon ion-plus-circled f20"></i>
							<p>还可添加 <i class="f14 color-aux">{{pictureSurplus}}</i> 张任务图片</p>
						</button>
					</div>
					<ion-scroll has-bouncing="false"
					            direction="x" id="pictureImg"
					            scrollbar-x="false"
					            style="padding-left:5px; padding-right: 5px; height: 130px;">
					</ion-scroll>
				</label>
				
			</div>
			<!--=== / 上传图片 ===-->	
			<!--=== 类型 ===-->
			<div class="list">
				<div class="item" 
				ng-switch="item.types" 
				ng-repeat="item in form.categoryObj.advanced_field">
				<div ng-switch-when="select">
					<div class="item-input item-stacked-label item-icon-right">
						<span class="input-label color-7">{{item.label}}：</span>
						<button class="button button-small button-dark button-outline" modal-select ng-model="$parent.form.extend[item.field]" options="item.option" modal-title="请选择一个{{item.label}}">
							{{ $parent.form.extend[item.field].label || &apos;请选择您的' + item.label }}
							<div class="option">
								<h2>{{option.label}}</h2>
								<p>{{option.ckey}}</p>
							</div>
						</button>
						<i class="icon f12"
						   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm[item.field].$invalid]">
						</i>
						<input type="hidden" name="{{item.field}}" ng-model="$parent.form.extend[item.field]" required>
					</div>
				</div>
				<div ng-switch-default>
					<label class="item-input item-stacked-label item-icon-right">
						<span class="input-label color-7">{{item.label}}:</span>
						<input type="{{item.types}}" name="{{item.field}}" ng-model="$parent.form.extend[item.field]"
							   ng-change="change($index)" placeholder="请填写{{item.label}}" required>
						<i class="icon f12"
						   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm[item.field].$invalid]">
						</i>
					</label>
				</div>
			</div>
			<!--=== / 类型 ===-->	
			<div class="item mb10">
				<label class="item-textarea item-stacked-label item-icon-right">
					<span class="input-label color-7">任务要求和说明:</span>
					<textarea name="explain" placeholder="请对任务进行说明和要求" ng-model="form.explain" style="width:90%" required></textarea>
					<i class="icon f12"
					   ng-class="{true: 'ion-close color-assertive', false: 'ion-checkmark color-balanced'}[theForm.explain.$invalid]"></i>
				</label>
			</div>
			<!--=== 费用合计 ===-->
			<div class="item row">
				<div class="col"><h2 class="p15">明细</h2></div>
				<div class="col p15">合计费用：￥<span class="color-assertive f18"> {{form.money}}</span></div>
			</div>
			
			<div class="item">
				<ul class="color-4 l-ha10 f14">
					<li class="row">
						<div class="col col-67 text-right color-7">面积大小：</div>
						<div class="col col-33 b5">{{form.extend.area}}㎡</div>
					</li>
					<li class="row">
						<div class="col col-67 text-right color-7">房型：</div>
						<div class="col col-33 b5">{{form.extend.house_layout.label}}</div>
					</li>
					<li class="row">
						<div class="col col-67 text-right color-7">户型：</div>
						<div class="col col-33 b5">{{form.extend.house_floor.label}}</div>
					</li>
					<li class="row">
						<div class="col col-67 text-right color-7">房屋类型：</div>
						<div class="col col-33 b5">{{form.extend.house_type.label}}</div>
					</li>
					<li class="row">
						<div class="col col-67 text-right color-7">预算审核：</div>
						<div class="col col-33 b5 color-assertive">￥{{form.money}}</div>
					</li>
				</ul>
			</div>
			<div class="item row" style="padding:15px;">
				<div class="col-75">预付费用：</div>
				<div class="col-25">￥<span class="color-assertive f18">{{form.money * 0.3}}</span></div>
			</div>
			<p class="p10 color-7">需要预先支付(30%)费用到平台作为担保金额</p>
			<!--=== / 费用合计 ===-->
			<div class="padding mtb15">
				<button class="button button-block button-aux" type="button" ng-click="submit()" ng-disabled="!theForm.$valid">去支付</button>
			</div>
		</form>
	</ion-content>
	<!--=== \ content ===-->
</ion-view>
